<template>
  <div :class="$style.wrapper" :style="tagStyle">
    <div :class="$style.detail">
      <p :class="$style.num">{{num}}</p>
      <p :class="$style.title">{{title}}</p>
    </div>
    <div :class="$style.dataIcon">
      <i class="ps ps-bw_01"></i>
    </div>
  </div>
</template>
<script>
export default {
  name: 'PsDataTag',
  computed: {
    tagStyle () {
      return {
        'background': this.color,
        border: `1px solid ${this.color}`
      };
    }
  },
  props: {
    title: {
      type: String,
      default: '数据标签'
    },
    num: {
      type: Number,
      default: 0
    },
    icon: {
      type: String
    },
    color: {
      type: String,
      default: '#0c466d'
    }
  }
};
</script>
<style lang="scss" module>
@import "./../../../style/wugang/data-tag.scss";
</style>
